<template>
    <h3>理财列表显示</h3>
    <table>
        <thead>
            <tr>
                <td>理财名称</td>
                <td>年收益</td>
                <td>理财最低金额</td>
                <td>理财人数</td>
                <td>风险等级</td>
                <td>利息</td>
                <td>操作</td>
            </tr>
        </thead>
        <tbody>
            <tr v-for="item in str" :key="item.F_Id" :value="item.F_Id">
                <td>{{ item.F_Name }}</td>
                <td>{{ item.F_APY }}</td>
                <td>{{ item.F_MinMoney }}</td>
                <td>{{ item.F_Number }}</td>
                <td>{{ item.F_Level }}</td>
                <td>{{ item.I_Interest }}</td>
                <td><button @click="Del(item.F_Id)">删除</button><button @click="Update(item.F_Id)">修改</button></td>
            </tr>
        </tbody>
    </table>
</template>
<script setup lang="ts">
import { ref, onMounted } from "vue"
import { useRouter } from "vue-router"
import axios from "axios"

const str = ref([
    {
        F_Name: "",
        F_APY: "",
        F_MinMoney: 0,
        F_Number: 0,
        F_Level: "",
        F_Id: 0,
        I_Interest: ""
    }
])
//钩子
onMounted(() => {
    Show();
})
const Show = () => {
    axios.get('http://localhost:60493/api/Financing/ShowFinancingInfo')
        .then(res => {
            str.value = res.data;
            console.log(res.data);
        })
        .catch(error => {
            console.log(error);
        })
}
//删除
const Del = (F_Id: number) => {
    axios.get('http://localhost:60493/api/Financing/Delete', {
        params: {
            F_Id: F_Id
        }
    })
        .then(res => {
            if (res.data > 0) {
                alert("删除成功")
                Show();
            }
            else {
                alert("删除失败")
                return;
            }
            console.log(res.data);
        })
        .catch(error => {
            console.log(error);
        });
}

const router = useRouter();
const Update = (F_Id: number) => {
    router.push({
        name: "Update",
        params: {
            F_Id: F_Id
        }
    });
}








</script>